﻿@using Classified.Data.Enums
@using Classified.Domain.Entities
@model ClassifiedAd
@{
    ViewBag.Title = "Create";
    Layout = "~/Areas/Admin/Views/Shared/_Layout.cshtml";
    var DropdownList = (int)AttributeControlType.DropdownList;
    var Checkboxes = (int)AttributeControlType.Checkboxes;
    var Datepicker = (int)AttributeControlType.Datepicker;
    var MultilineTextbox = (int)AttributeControlType.MultilineTextbox;
    var RadioList = (int)AttributeControlType.RadioList;
    var TextBox = (int)AttributeControlType.TextBox;
    
}
@Html.CKEditorHeaderScripts()
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<script src="/Scripts/jquery.cookie.js" type="text/javascript"></script>
<h1>
    Create <small>Classified Ad</small></h1>
@using (Html.BeginForm("Create", "Classified", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
    <div style="margin-bottom: 18px;" class="tabbable">
        <ul class="nav nav-tabs">
            <li class="active"><a data-toggle="tab" href="#tabs-1">Classified Details</a></li>
            <li class=""><a data-toggle="tab" href="#tabs-2">SEO</a></li>
            <li class=""><a data-toggle="tab" href="#tabs-3">Images</a></li>
            <div class="clear">
            </div>
        </ul>
        <div style="padding-top: 20px;" class="tab-content">
            <div id="tabs-1" class="tab-pane active">
                @Html.ValidationSummary(true)
                <fieldset>
                    @Html.HiddenFor(model => model.Id)
                    @Html.HiddenFor(model => model.CreatedOnUtc)
                    @Html.HiddenFor(model => model.UpdatedOnUtc)
                    @Html.HiddenFor(model => model.SubmitDate)
               
                 <div class="clearfix">
                        <label>
                            Locations
                        </label>
                        <div class="input">
                            @Html.DropDownList("Country", "Choose-Category")
                            <div id="location-dropdown">
                               </div>
                            </div>
                        </div>
                        <div class="clearfix">
                            <label>
                                category :</label>
                            <div id="categroy-dropdown" class="input">
                            </div>
                        </div>

                    <div class="clear">
                    </div>
                    <div id="Attributes-list">
                    </div>
                    <div class="clear">
                    </div>
                    <div class="clearfix">
                        @Html.LabelFor(model => model.Title)
                        <div class="input">
                            @Html.EditorFor(model => model.Title)
                            @Html.ValidationMessageFor(model => model.Title)
                        </div>
                    </div>
                    <div class="clearfix" id="Price">
                        @Html.LabelFor(model => model.Price)
                        <div class="input">
                        <span id="curr_code"></span>    @Html.EditorFor(model => model.Price)
                            @Html.ValidationMessageFor(model => model.Price)
                        </div>
                    </div>
                    <div class="clearfix">
                        @Html.LabelFor(model => model.Description)
                        <div class="input span7">
                            @Html.CKEditorFor(model => model.Description, "{toolbar: 'Basic'}")
                            @Html.ValidationMessageFor(model => model.Description)
                        </div>
                    </div>
                    <b class="clear"></b>
                    <div class="clearfix">
                        @Html.LabelFor(model => model.EmailID)
                        <div class="input">
                            @Html.EditorFor(model => model.EmailID)
                            @Html.ValidationMessageFor(model => model.EmailID)
                        </div>
                    </div>
                    <div class="opt-info">
                        <div class="input long">
                            <h3>
                                Optional Information :</h3>
                        </div>
                        <div class="clear">
                        </div>
                        <b class="clear"></b>
                        <div class="clearfix">
                            @Html.LabelFor(model => model.PhoneNumber)
                            <div class="input long">
                                @Html.EditorFor(model => model.PhoneNumber)
                                @Html.ValidationMessageFor(model => model.PhoneNumber)
                            </div>
                        </div>
                        <div class="clearfix">
                            @Html.LabelFor(model => model.Address)
                            <div class="input long">
                                @Html.EditorFor(model => model.Address)
                                @Html.ValidationMessageFor(model => model.Address)
                            </div>
                        </div>
                        <div class="clearfix">
                            @Html.LabelFor(model => model.IsActive)
                            <div class="input">
                                @Html.EditorFor(model => model.IsActive)
                                @Html.ValidationMessageFor(model => model.IsActive)
                            </div>
                        </div>
                        <div class="clearfix">
                            @Html.LabelFor(model => model.IsEnhanced)
                            <div class="input">
                                @Html.EditorFor(model => model.IsEnhanced)
                                @Html.ValidationMessageFor(model => model.IsEnhanced)
                            </div>
                        </div>
                    </div>
                    <div class="actions">
                        <input type="submit" class="btn" value="Save" />
                        @Html.ActionLink("Back to List", "List", null, new { @class = "btn" })
                    </div>
                </fieldset>
            </div>
            <div id="tabs-2" class="tab-pane">
                <div class="clearfix">
                    @Html.LabelFor(model => model.MetaTitle)
                    <div class="input">
                        @Html.EditorFor(model => model.MetaTitle)
                        @Html.ValidationMessageFor(model => model.MetaTitle)
                    </div>
                </div>
                <div class="clearfix">
                    @Html.LabelFor(model => model.MetaKeyWord)
                    <div class="input">
                        @Html.EditorFor(model => model.MetaKeyWord)
                        @Html.ValidationMessageFor(model => model.MetaKeyWord)
                    </div>
                </div>
                <div class="clearfix">
                    @Html.LabelFor(model => model.MetaDesc)
                    <div class="input">
                        @Html.TextAreaFor(model => model.MetaDesc)
                        @Html.ValidationMessageFor(model => model.MetaDesc)
                    </div>
                </div>
            </div>
            <div id="tabs-3" class="tab-pane">
                @if (Model != null && Model.Id > 0)
                {
            
                    <text> Select Images:
                    <input name="attachments" id="attachments" type="file" />
                    <a href="javascript:window.location.reload(true);" class="show-all">Show all Pictures</a>
                    <div id="hiddenimages">
                        @*  @{Html.RenderAction("MyCompanyPictures", Model.Id);}*@
                    </div>
                    </text>
                }
                else
                {
                    <text> You need to save the ads before you can upload pictures for this ads.
                    </text>
                }
            </div>
        </div>
    </div>
}
<script type="text/javascript">

    $(document).ready(function () {
        $(".chzn-select select").chosen({ width: '600px' });
        $(".chzn-select-deselect").chosen({ allow_single_deselect: false });
     $.ajax({
                url: "@Url.Action("GetCategoryParent", "Classified")",
                //data: { parentId: categoryId, id: Id },
                dataType: "json",
                type: "POST",
                error: function() {
                    alert("An error occurred.");
                },

                success: function(data) {
                    var items = "<select name='CategoryParent' class='CategoryParent' id=\"" + data.Guid + "\">";
                    items += "<option value=\"" + 0 + "\">" + "--Choose Category--" + "</option>";
                    $.each(data.categoryparent, function(i, item) {

                        items += "<option value=\"" + item.Id + "\">" + item.Name + "</option>";
                    });
                    items += "</select>";
                    $("#test").prepend(items);

                }
            });
       


        $("#Country").change(function() {
            var id = $(this).val();
           getparentlocation(id);
           
        });
                  $('.location-Area').live("change",function(e) {
            e.preventDefault();
            var last_child = $("#location-dropdown select").last().attr("id");
            var first_child = $("#location-dropdown select").first().attr("id");
            var cur_id = $(this).attr("id");
            var x = 0;
            var attr_class = cur_id;
            if(cur_id != last_child) {
                $("#" + last_child).css("display", "none");
                x = $(this).next().attr('id'); 
                $("#" + cur_id).nextAll().css("display", "none");
               
            }
            if(cur_id != first_child) {
                var prev = $("#" + cur_id).prevAll();
                var element = document.getElementsByClassName("location-Area");
                $.each(prev, function(index) {

                    attr_class += " "+ element[index].id;
                });
            }
            var id = $(this).val();
            $("#"+x).html("");
            $("#"+x).css("display","none");
            $("." + cur_id).remove();
            getlocationChild(x,id);
          
        });
       $('.CategoryParent').live("change",function(e) {
            e.preventDefault();
            var last_child = $("#categroy-dropdown select").last().attr("id");
            var first_child = $("#categroy-dropdown select").first().attr("id");
            var cur_id = $(this).attr("id");
            var x = 0;
            var attr_class = cur_id;
            if(cur_id != last_child) {
                $("#" + last_child).css("display", "none");
                x = $(this).next().attr('id'); 
                $("#" + cur_id).nextAll().css("display", "none");
               
            }
            if(cur_id != first_child) {
                var prev = $("#" + cur_id).prevAll();
                var element = document.getElementsByClassName("CategoryParent");
                $.each(prev, function(index) {

                    attr_class += " "+ element[index].id;
                });
            }
             $("#Attributes-list_old").remove();
            var id = $(this).val();
            $("#"+x).html("");
            $("#"+x).css("display","none");
            $("." + cur_id).remove();
            getcategoryChild(x,id);
            getAttributes(id,attr_class);
                   var first_childId=$("#"+first_child).val();
      GetPriceShown(first_childId);
          
        });
         
    });

    function GetPriceShown(id) {
        $.ajax({
            url: "@Url.Action("GetPriceShown", "Classified")",
            data: { id: id },
            dataType: "json",
            type: "POST",
            error: function() {
                alert("An error occurred.");
            },
            success: function(data) {
                if (data.toString() == "false") {
                    $("#Price").css("display", "none");
                  
                } else {
                    $("#Price").css("display", "block");
                     
                }
            }
        });
    }

       function getparentlocation(countryId) {
       $.ajax({
           url: "@Url.Action("LoadLocationByCountry", "Classified")",
           data: { id: countryId },
           dataType: "json",
           type: "POST",
           error: function() {
               alert("An error occurred.");
           },
            success: function(data) {
              var iso = data.ISO;
              
              $("#curr_code").text(iso);
               
               if (data.locationlist.length > 0)
                   {
                   var items = "";
                    items += "<select name='locationParent' class='location-Area' id=\"" + data.guid + "\">";
                        items += "<option value=\"" + 0 + "\">" + "--Choose location--" + "</option>";
                        $.each(data.locationlist, function(i, item) {

                            items += "<option value=\"" + item.Id + "\">" + item.Name + "</option>";
                        });
                        items += "</select>";
                        $("#location-dropdown").html(items);
                
           } else {
  $("#location-dropdown").html('');
               }
               
       }
              
        });
       // $("#CategoryType").css("display", "none");

    }
    function getlocationChild(guid,locationId) {
    
        $.ajax({
            url: "@Url.Action("LoadLocationByLocationId", "ClassifiedAds")",
            data: { id: locationId },
            dataType: "json",
            type: "POST",
            error: function() {
                alert("An error occurred.");
            },
            success: function(data) {
                var items = ""; 
                if(data.list.length >0) {
                if(guid !="0") {
                    
                    items += "<option value=\"" +  + "\">" + "--Choose Area--" + "</option>";
                    $.each(data.list, function(i, item) {

                        items += "<option value=\"" + item.Id + "\">" + item.Name + "</option>";
                    });
                    
                    $("#" + guid).css("display", "block");
                    $("#"+guid).html(items);
                }
                else {
                   
                        items = "<select name='locationParent' class='location-Area' id=\"" + data.guid + "\">";
                        items += "<option value=\"" + 0 + "\">" + "--Choose Category--" + "</option>";
                        $.each(data.list, function(i, item) {

                            items += "<option value=\"" + item.Id + "\">" + item.Name + "</option>";
                        });
                        items += "</select>";
                        $("#location-dropdown").append(items);
                    }
                }
                
            }
            
        });
    }
function getAttributes(categoryId,cur_Id) {
        var items = "";
        
        $.ajax({
            url: "@Url.Action("LoadArrtributes", "Classified")",
            data: { id: categoryId },
            dataType: "json",
            type: "POST",
            error: function() {
                alert("An error occurred.");
            },
            success: function(data) { 
                
                if (data.length > 0) {
                    $.each(data, function(i, item) {
                        items += "<div class='clearfix "+ cur_Id + "'><label>" + item.Attr_Label + "</label><div class='input'>";
                        var cnt = item.AttributeControlTypeId;
                        switch (true) {
                        case (cnt == @DropdownList):
                            items += "<select id='" + item.Id + "' class='" + cur_Id + "' name='AttributName'>";
                            $.each(item.AttributeValues, function(ii, values) {
                                items += "<option value=\"" + values.Id + "\">" + values.Value + "</option>";
                            });
                            items += "</select>";

                            break;
                        case (cnt == @Checkboxes): 
                            if (item.AttributeValues.length > 0) {
                                $.each(item.AttributeValues, function(ii, values) {

                                    items += "<input type='checkbox' class='" + cur_Id + "' name='AttributName' value=\"" + values.Id + "\" />" + values.Value;
                                });
                            } else {
                                items += "<input type='checkbox' class=\"" + cur_Id + "\" name=\"" + item.Attr_Name + "\" value=\"" + item.Id + "\" />";
                            }

                            break;
                        case (cnt == @MultilineTextbox):
                            items += "<textarea type='text' class=\"" + cur_Id + "\" name=\"" + item.Attr_Name + "\" />";
                            break;
                        case (cnt == @Datepicker):
                            alert('21');
                            break;
                        case (cnt == @RadioList):                               
                            if (item.AttributeValues.length > 0) {
                                $.each(item.AttributeValues, function(ii, values) {

                                    items += "<input type='radio' class=\"" + cur_Id + "\" name='AttributName' value=\"" + values.Id + "\" />" + values.Value;
                                });
                            }
                            break;
                        case (cnt == @TextBox):
                            items += "<input type='text' class=\"" + cur_Id + "\" name=\"" + item.Attr_Name + "\" />";
                            break;
                        default:
                            alert('>41');
                        }
                        items += "</div></div>";
                        $("#Attributes-list").append(items);
                        items = "";

                    });
                    

                } else {
                    
                    
                }
                    
                
            }
        });

    }

   





    function getcategoryChild(guid,categoryId) {
        
     
        $.ajax({
            url: "@Url.Action("LoadCategoryChild", "Classified")",
            data: {id: categoryId},
            dataType: "json",
            type: "POST",
            error: function() {
                alert("An error occurred.");
            },
            success: function(data) {
                var items = ""; 
                if(data.list.length >0) {
                if(guid !="0") {
                    
                    items += "<option value=\"" + 0 + "\">" + "--Choose Category--" + "</option>";
                    $.each(data.list, function(i, item) {

                        items += "<option value=\"" + item.Id + "\">" + item.Name + "</option>";
                    });
                    
                    $("#" + guid).css("display", "block");
                    $("#"+guid).html(items);
                }
                else {
                   
                        items = "<select name='CategoryParent' class='CategoryParent' id=\"" + data.guid + "\">";
                        items += "<option value=\"" + 0 + "\">" + "--Choose Category--" + "</option>";
                        $.each(data.list, function(i, item) {

                            items += "<option value=\"" + item.Id + "\">" + item.Name + "</option>";
                        });
                        items += "</select>";
                        $("#test").append(items);
                    }
                }
            }
        });

    }
</script>
